<template>
	<view class="content" v-if="pageShow==1">
		<view class="card-box" v-show="ComplianceTotalShow">
			<div class="main-box" @click="slowDownPermission()">
				<view class="main-title">
					{{ComplianceTotalName}}
				</view>
			</div>
			<view class="main-card">
				<view class="main-card-row1">
					<view class="main-list">
						<view class="main-data" @click="openComplianceTotalPage('ComplianceTotalcheckTotal')">
							<span >{{ComplianceTotalData.checkTotal}}</span>
							<span>合规检查总数</span>
						</view>
						<view class="main-data" @click="openComplianceTotalPage('ComplianceRatecheckTotal')">
							<span style="color: #5cf976;">{{ComplianceTotalData.complianceRate}}</span>
							<span>合规率</span>
						</view>
						<view class="main-data" @click="openComplianceTotalPage('RegistrationComplianceRatecheckTotal')">
							<span style="color: #FFCC00;">{{ComplianceTotalData.registration_compliance_rate}}</span>
							<span>合规率不达标数</span>
						</view>

					</view>
					<view class="main-list">
						<view class="main-data"  @click="openComplianceTotalPage('noComplianceTotal')">
							<span style="color: #FFCC00;">{{ComplianceTotalData.noComplianceTotal}}</span>
							<span>不合规数</span>
						</view>
						<view class="main-data" @click="openComplianceTotalPage('SeDeviceFailInfoTotal')">						
							<span style="color: #FFCC00;">{{DeviceFailInfoTotalData}}</span>
							<span>设备连接失败数</span>
						</view>
						<view class="main-data" @click="openComplianceTotalPage('abnormalTotal')">
							<span style="color: #FFCC00;">{{ComplianceTotalData.abnormalTotal}}</span>
							<span>未执行异常数</span>
						</view>
					</view>
				</view>
				<view class="main-card-row2">
					<view style="padding-left: 30rpx;" class="row2-left">
						<view class="" @click="openComplianceTotalPage('ComplianceAccountTotal')">
							<span>账号总数</span>
							<span>{{SecurityInfoData.accountTotal}}</span>
						</view>
						<view class="" @click="openComplianceTotalPage('SeWeakPasswordcount')">
							<span>弱口令数</span>
							<span style="color: #FFCC00;">{{SecurityInfoData.weakPasswordcount}}</span>
						</view>
						<view class="" @click="openComplianceTotalPage('SeWeakPasswordcounts')">
							<span>弱口令占比</span>
							<span>{{SecurityInfoData.proportion}}</span>
						</view>
					</view>
					<view class="division-line"></view>
					<view style="padding-left: 30rpx;" class="row2-right">
						<view class="" @click="openAnyToanyTotalPage('SeAnyToanyTotal')">
							<span>双Any策略数</span>
							<span style="color: #FFCC00;">{{AnyToAnyInfoData.anyToanyTotal}}</span>
						</view>
						<view class="" @click="openPoliciesPortPage('SeResourcesCount')">
							<span>未纳管防火墙数</span>
							<span style="color: #FFCC00;">{{AnyToAnyInfoData.resourcesCount}}</span>
						</view>
						<view class="" @click="openAnyToanyTotalPage('SePoliciesCount')">
							<span>开放维护端口数</span>
							<span style="color: #FFCC00;">{{AnyToAnyInfoData.policiesCount}}</span>
						</view>
					</view>
				</view>
			</view>
	    </view>
		<view class="card-box" v-show="DepsComplianceShow">
			<div class="main-box">
				<view class="main-title">
					{{DepsComplianceName}}
				</view>
			</div>
			<view class="main-card">
				<view v-for="(item, index) in DepsComplianceTotalData" :key="index">
					<view class="dept-name">
						<img style="width: 64rpx; margin-right: 30rpx;" src="@/static/deptIcon4.png" alt="" />
						<view style="padding-top: 7rpx; color:#303133;">{{item.depName}}</view>
					</view>
					<view class="admin-card-content">
						<view class="row1">
							<view class="main-list">
								<view class="main-data" @click="openComplianceTotalPage('DepsComplianceTotal',item.depId)">
									<span>{{item.checkTotal}}</span>
									<span>合规检查总数</span>
								</view>
								<view class="main-data" @click="openComplianceTotalPage('DepsComplianceRate',item.depId)">
									<span style="color: #0CB480;">{{item.complianceRate}}</span>
									<span>合规率</span>
								</view>
								<view class="main-data" @click="openComplianceTotalPage('DepsRegistrationComplianceRate',item.depId)">
									<span style="color: #FF9501;">{{item.registration_compliance_rate}}</span>
									<span>合规率不达标数</span>
								</view>
							</view>
							<view class="main-list">
								<view class="main-data" @click="openComplianceTotalPage('depsNoComplianceTotal',item.depId)">
									<span style="color: #FF9501;">{{item.noComplianceTotal}}</span>
									<span>不合规数</span>
								</view>
								<view class="main-data" @click="openComplianceTotalPage('depsDeviceFailInfoTotal',item.depId)">
									<span style="color: #FF9501;">{{item.failCount}}</span>
									<span>设备连接失败数</span>
								</view>
								<view class="main-data"  @click="openComplianceTotalPage('depsAbnormalTotal',item.depId)">
									<span style="color: #FF9501;">{{item.abnormalTotal}}</span>
									<span>未执行异常数</span>
								</view>
                            </view>
						</view>
						<view class="row2">
							<view class="row2-left">
								<view class="" @click="openComplianceTotalPage('DepsAccountTotal',item.depId)">
									<span>账号总数</span>
									<span>{{item.accountTotal}}</span>
								</view>
								<view class=""  @click="openComplianceTotalPage('depsWeakPasswordcount',item.depId)">
									<span>弱口令数</span>
									<span>{{item.weakPasswordcount}}</span>
								</view>
								<view class="" @click="openComplianceTotalPage('depsWeakPasswordcounts',item.depId)">
									<span>弱口令占比</span>
									<span>{{item.proportion}}</span>
								</view>
							</view>
							<view class="row2-right">
								<view class="" @click="openAnyToanyTotalPage('depsAnyToanyTotal',item.depId)">
									<span>双Any策略数</span>
									<span>{{item.anyToanyTotal}}</span>
								</view>
								<view class="" @click="openPoliciesPortPage('depsResourcesCount',item.depId)">
									<span>未纳管防火墙数</span>
									<span>{{item.resourcesCount}}</span>
								</view>
								<view class="" @click="openAnyToanyTotalPage('depsPoliciesCount',item.depId)">
									<span>开放维护端口数</span>
									<span>{{item.policiesCount}}</span>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="card-box" v-show="DepComplianceShow">
			<div class="main-box">
				<view class="main-title">
					{{DepComplianceName}}
				</view>
			</div>
			<view class="main-card">
				<view class="card-top">
					<view class="card-title">
						合规率
					</view>
					<view class="card-content">
						<view class="felx-box" style="border-bottom: 1px solid #F6F6F6;">
							<view class="" @click="openComplianceTotalPage('DepCheckTotal')">
								<span style="color: #000;">{{DepComplianceTotalData.checkTotal}}</span>
								<span>合规检查总数</span>
							</view>
							<view class="" @click="openComplianceTotalPage('DepComplianceRate')">
								<span style="color: #16CBAC;">{{DepComplianceTotalData.complianceRate}}</span>
								<span>合规率</span>
							</view>

							<view class="" @click="openComplianceTotalPage('DepRegistrationComplianceRate')">
								<span style="color: #F37A00;">{{DepComplianceTotalData.registration_compliance_rate}}</span>
								<span>合规率不达标数</span>
							</view>

						</view>
						<view class="felx-box">
							<view class="" @click="openComplianceTotalPage('DepNoComplianceTotal')">
								<span style="color: #F37A00;">{{DepComplianceTotalData.noComplianceTotal}}</span>
								<span>不合规数</span>
							</view>
							<view class="" @click="openComplianceTotalPage('DepDeviceFailInfoTotal')">
								<span style="color: #F37A00;">{{DepDeviceFailInfoTotalData}}</span>
								<span>设备连接失败数</span>
							</view>
							<view class="" @click="openComplianceTotalPage('DepAbnormalTotal')">
								<span style="color: #F37A00;">{{DepComplianceTotalData.abnormalTotal}}</span>
								<span>未执行异常数</span>
							</view>
						</view>
					</view>
				</view>
				<view class="card-group">
					<view class="card">
						<view class="card-title">
							弱口令
						</view>
						<view class="card-content">
							<view class="chart-box-column">
								<view style="width: 100%; height: 350rpx" @click="openComplianceTotalPage('DepSecurityInfoAll')"><l-echart ref="chartRef1" @finished="init"></l-echart>
								</view>
								<view class="chart-tips">
									<span>
										<span>弱口令数</span>
										<span>弱口令占比</span>
									</span>
									<span>
										<span class="tips-num" style="color: #000;" @click="openComplianceTotalPage('DepWeakPasswordcount')">{{DepSecurityInfoData.weakPasswordcount}}</span>
										<span class="tips-num" style="color: #000;" @click="openComplianceTotalPage('DepWeakPasswordcounts')">{{DepSecurityInfoData.proportion}}</span>
									</span>
								</view>
							</view>
						</view>
					</view>
					<view class="card" style="margin-left: 0;">
						<view class="card-title">
							违规策略
						</view>
						<view class="card-content">
							<view class="chart-box-column">
								<view style="width: 100%; height:  350rpx" @click="openAnyToanyTotalPage('DepAnyToAnyPegeList')"><l-echart ref="chartRef2" @finished="init"></l-echart>
								</view>
								<view class="chart-tips">
									<span>
										<span>未纳管防火墙数</span>
										<span>开放维护端口数</span>
									</span>
									<span>
										<span class="tips-num" style="color: #000;" @click="openPoliciesPortPage('DepResourcesCount')">{{DepAnyToAnyInfoData.resourcesCount}}</span>
										<span class="tips-num" style="color: #000;" @click="openAnyToanyTotalPage('DepPoliciesCount')">{{DepAnyToAnyInfoData.policiesCount}}</span>
									</span>
								</view>
							</view>
						</view>
					</view>
				</view>			
			</view>
		</view>	
		<view class="card-box" v-show="UserComplianceShow">
			<div class="main-box">
				<view class="main-title">
					{{UserComplianceName}}
				</view>
			</div>
			<view class="main-card">
				<view class="card-top">
					<view class="card-title">
						合规率
					</view>
					<view class="card-content">
						<view class="felx-box" style="border-bottom: 1px solid #F6F6F6;">
							<view class="" @click="openComplianceTotalPage('UserCheckTotal')">
								<span style="color: #000;">{{UserComplianceTotalData.checkTotal}}</span>
								<span>合规检查总数</span>
							</view>
							<view class=""  @click="openComplianceTotalPage('UserComplianceRate')">
								<span style="color: #16CBAC;">{{UserComplianceTotalData.complianceRate}}</span>
								<span>合规率</span>
							</view>
							<view class="" @click="openComplianceTotalPage('UserRegistrationComplianceRate')">
								<span style="color: #F37A00;">{{UserComplianceTotalData.registration_compliance_rate}}</span>
								<span>合规率不达标数</span>
							</view>

						</view>
						<view class="felx-box">
							<view class="" @click="openComplianceTotalPage('UserNoComplianceTotal')">
								<span style="color: #F37A00;">{{UserComplianceTotalData.noComplianceTotal}}</span>
								<span>不合规数</span>
							</view>
							<view class="" @click="openComplianceTotalPage('UserDeviceFailInfoTotal')">
								<span style="color: #F37A00;">{{UserDeviceFailInfoTotalData}}</span>
								<span>设备连接失败数</span>
							</view>
							<view class="" @click="openComplianceTotalPage('UserAbnormalTotal')">
								<span style="color: #F37A00;">{{UserComplianceTotalData.abnormalTotal}}</span>
								<span>未执行异常数</span>
							</view>
						</view>
					</view>
				</view>
				<view class="card-group">
					<view class="card">
						<view class="card-title">
							弱口令
						</view>
						<view class="card-content">
							<view class="chart-box-column">
								<view style="width: 100%; height: 350rpx" @click="openComplianceTotalPage('UserweakPasswordcountAll')"><l-echart ref="chartRef3" @finished="init"></l-echart>
								</view>
								<view class="chart-tips">
									<span>
										<span>弱口令数</span>
										<span>弱口令占比</span>
									</span>
									<span>
										<span class="tips-num" style="color: #000;" @click="openComplianceTotalPage('UserweakPasswordcount')">{{UserSecurityInfoData.weakPasswordcount}}</span>
										<span class="tips-num" style="color: #000;" @click="openComplianceTotalPage('UserweakPasswordcount')">{{UserSecurityInfoData.proportion}}</span>
									</span>
								</view>
							</view>
						</view>
					</view>
					<view class="card" style="margin-left: 0;">
						<view class="card-title">
							违规策略
						</view>
						<view class="card-content">
							<view class="chart-box-column">
								<view style="width: 100%; height:  350rpx" @click="openAnyToanyTotalPage('UserAnyToAnyPegeList')"><l-echart ref="chartRef4"
										@finished="init"></l-echart>
								</view>
								<view class="chart-tips">
									<span>
										<span>未纳管防火墙数</span>
										<span>开放维护端口数</span>
									</span>
									<span>
										<span class="tips-num" style="color: #000;" @click="openPoliciesPortPage('UserResourcesCount')">{{UserAnyToAnyInfoData.resourcesCount}}</span>
										<span class="tips-num" style="color: #000;" @click="openAnyToanyTotalPage('UserPoliciesCount')">{{UserAnyToAnyInfoData.policiesCount}}</span>
									</span>
								</view>
							</view>
						</view>
					</view>
				</view>			
			</view>
		</view>				
	</view>
	<u-loading v-else-if="pageShow==2" class="loading" size="80" mode="flower" :show="loading" color="primar"></u-loading>
	<u-empty  v-else-if="pageShow==0" style="margin-top: 100px;" iconSize='200' textSize='18' mode="data" icon="@/static/empty.png" text='暂无数据'></u-empty>
</template>

<script>
	import * as echarts from '@/uni_modules/lime-echart/static/echarts.min'
	export default {
		data() {
			return {
				pageShow:0,
				loading:false,	
				ComplianceTotalData:{},
				SecurityInfoData:{},
				AnyToAnyInfoData:{},
				DepsComplianceTotalData:[],
				DepComplianceTotalData:{},
				DepSecurityInfoData:{},
				DepAnyToAnyInfoData:{},
				UserComplianceTotalData:{},
				UserSecurityInfoData:{},
				UserAnyToAnyInfoData:{},
				DeviceFailInfoTotalData:{},
				DepIdDeviceFailInfoTotalData:[],
				DepDeviceFailInfoTotalData:{},
				UserDeviceFailInfoTotalData:{},
				UserDeviceFailInfoTotal:{},
				DepIdDeviceFailInfoTotal:{},
				option1: {},
				option2: {},
				option3: {},
				option4: {},
				assetInfo: [
					{
						deptName: '互联网部'
					},
					{
						deptName: 'IDC运营'
					}
				],
				ComplianceTotalName:'',
				DepsComplianceName:'',
				DepComplianceName:'',
				UserComplianceName:'',
				ComplianceTotalShow:false,
				DepsComplianceShow:false,
				DepComplianceShow:false,
				UserComplianceShow:false,
				title: '数据统计',
			};
		},
		created () {
		     this.getpermission()
		},
		activated() {
			this.changeTitle('数据统计')
		},
		// 组件能被调用必须是组件的节点已经被渲染到页面上
		methods: {
			changeTitle(newTitle) {
			  this.title = newTitle;
			  uni.setNavigationBarTitle({
				title: this.title
			  });
			},
			// 获取当前用户标签权限
			async getpermission() {
				let that=this
				let data = await this.$api.getpermission(); //已经封装好的api
				if (data.Code == 200) {
					// this.loading = false
					this.permissionData=data.Data
					that.permissionData.forEach((e, index) => {
						  if (e.PermissionName == '合规') {
							that.pageShow=true
						  }
						  if(e.Children&&e.Children.length>0){
							  e.Children.forEach((item, index) => {
								  if(item.PermissionName=="管理员-合规汇总"){									  
										  that.ComplianceTotalName=item.PermissionName
										  that.getComplianceTotal()
										  that.getSecurityInfo()
										  that.getAnyToAnyInfo()
										  that.getDeviceFailInfoTotal()
								  }else if(item.PermissionName=="管理员-部门合规明细"){
										  that.DepsComplianceName=item.PermissionName
										  that.getDepsComplianceTotal()
								  }else if(item.PermissionName=="部门管理员-合规汇总"){
										  that.DepComplianceName=item.PermissionName
										  that.DepComplianceShow=true	
			                              that.getDepComplianceTotal()
			                              that.getDepSecurityInfo()
			                              that.getDepAnyToAnyInfo()
										  that.GetDepDeviceFailInfoTotal()
								  }else if(item.PermissionName=="个人-合规情况"){
										  that.UserComplianceName=item.PermissionName
										  that.UserComplianceShow=true
										  that.getUserComplianceTotal()
										  that.getUserSecurityInfo()
										  that.getUserAnyToAnyInfo()
										  that.getUserDeviceFailInfoTotal()
			
								  }
							  })							  
						  }
						})	
				} else {
					uni.showToast({
						title: '请求失败!',
						icon: 'none',
						duration: 5000,
						mask: true,
					});
				}
			},
			openComplianceTotalPage(type,id) {//账号总数
				this.$router.push({
				   path:'/pages/ComplianceTotalPage/index',query:{
				   type: type,
				   DeptID:id
				   }});
			},
			openAnyToanyTotalPage(type,id) {//双Any策略数
				this.$router.push({
				   path:'/pages/AnyToanyTotalPage/index',query:{
				   type: type,
				   DeptID:id
				   }});
			},
			openPoliciesPortPage(type,id) {//未管纳防火墙分页
				this.$router.push({
				   path:'/pages/PoliciesPortPage/index',query:{
				   type: type,
				   DeptID:id
				   }});
			},
			async getComplianceTotal() {//管理员统计合格率统计
			    this.loading=true
				let data = await this.$api.getComplianceTotal(); //已经封装好的api
				if (data.Code == 200) {
					// this.loading = false
					this.ComplianceTotalData=data.Data	
					this.pageShow=1
				} else {
					uni.showToast({
						title: data.Message,
						icon: 'none',
						duration: 5000,
						mask: true,
					});
				}
			},
			async getDeviceFailInfoTotal() {//管理员获取联通设备数量
			    this.loading=true
				let data = await this.$api.getDeviceFailInfoTotal(); //已经封装好的api
				if (data.Code == 200) {
					// this.loading = false
					this.DeviceFailInfoTotalData=data.Data	
					this.pageShow=1
				} else {
					uni.showToast({
						title: data.Message,
						icon: 'none',
						duration: 5000,
						mask: true,
					});
				}
			},
			async GetDepIdDeviceFailInfoTotal(depId) {//管理员根据部门id获取联通设备数量
			    this.loading=true
				params=`?depId=${depId}`
				let data = await this.$api.GetDepIdDeviceFailInfoTotal(params); //已经封装好的api
				if (data.Code == 200) {
					// this.loading = false
					this.DepIdDeviceFailInfoTotalData=data.Data	
					this.pageShow=1
					return this.DepIdDeviceFailInfoTotalData
				} else {
					uni.showToast({
						title: data.Message,
						icon: 'none',
						duration: 5000,
						mask: true,
					});
				}
			},
			async getUserDeviceFailInfoTotal() {//个人获取联通设备数量
			    this.loading=true
				let data = await this.$api.getUserDeviceFailInfoTotal(); //已经封装好的api
				if (data.Code == 200) {
					// this.loading = false
					this.UserDeviceFailInfoTotalData=data.Data	
					this.pageShow=1
				} else {
					uni.showToast({
						title: data.Message,
						icon: 'none',
						duration: 5000,
						mask: true,
					});
				}
			},

			async GetDepDeviceFailInfoTotal() {//部门获取联通设备数量
			    this.loading=true
				let data = await this.$api.GetDepDeviceFailInfoTotal(); //已经封装好的api
				if (data.Code == 200) {
					// this.loading = false
					this.DepDeviceFailInfoTotalData=data.Data	
					this.pageShow=1
				} else {
					uni.showToast({
						title: data.Message,
						icon: 'none',
						duration: 5000,
						mask: true,
					});
				}
			},
			async getSecurityInfo() {//管理员统计合格率统计
			    this.loading=true
				let data = await this.$api.getSecurityInfo(); //已经封装好的api
				if (data.Code == 200) {
					// this.loading = false
					this.SecurityInfoData=data.Data
					this.pageShow=1
				} else {
					uni.showToast({
						title: data.Message,
						icon: 'none',
						duration: 5000,
						mask: true,
					});
				}
			},
			async getAnyToAnyInfo() {//管理员违规策略统计
			    this.loading=true
				let data = await this.$api.getAnyToAnyInfo(); //已经封装好的api
				if (data.Code == 200) {
					// this.loading = false
					this.AnyToAnyInfoData=data.Data
					this.ComplianceTotalShow=true	
					this.pageShow=1
				} else {
					uni.showToast({
						title: data.Message,
						icon: 'none',
						duration: 5000,
						mask: true,
					});
				}
			},
			async getDepsComplianceTotal() {//管理员获取所有部门统计
			    this.loading=true
				let data = await this.$api.getDepsComplianceTotal(); //已经封装好的api
				if (data.Code == 200) {
					// this.loading = false
					this.DepsComplianceTotalData=data.Data
					this.pageShow=1
					this.DepsComplianceShow=true	
				} else {
					uni.showToast({
						title: data.Message,
						icon: 'none',
						duration: 5000,
						mask: true,
					});
				}
			},
			async getDepComplianceTotal() {//部门统计合格率统计
			    this.loading=true
				let data = await this.$api.getDepComplianceTotal(); //已经封装好的api
				if (data.Code == 200) {
					// this.loading = false
					this.DepComplianceTotalData=data.Data
					this.pageShow=1
				} else {
					uni.showToast({
						title: data.Message,
						icon: 'none',
						duration: 5000,
						mask: true,
					});
				}
			},
			async getDepSecurityInfo() {//部门弱口令统计
			    this.loading=true
				let data = await this.$api.getDepSecurityInfo(); //已经封装好的api
				if (data.Code == 200) {
					// this.loading = false					
					this.DepSecurityInfoData=data.Data
					// chart 图表实例不能存在data里
					this.getOption({
						data1: this.DepSecurityInfoData.weakPasswordcount,
						data2: this.DepSecurityInfoData.accountTotal,
						total: this.DepSecurityInfoData.accountTotal,
					}, 1)
					const chart1 = await this.$refs.chartRef1.init(echarts);
					chart1.setOption(this.option1)
					this.pageShow=1
				} else {
					uni.showToast({
						title: data.Message,
						icon: 'none',
						duration: 5000,
						mask: true,
					});
				}
			},
			async getDepAnyToAnyInfo() {//部门违规策略统计
				this.loading=true
				let data = await this.$api.getDepAnyToAnyInfo(); //已经封装好的api
				if (data.Code == 200) {
					// this.loading = false					
					this.DepAnyToAnyInfoData=data.Data
					// chart 图表实例不能存在data里
					this.getOption({
						data1: this.DepAnyToAnyInfoData.resourcesCount,
						data2: this.DepAnyToAnyInfoData.policiesCount,
						total: this.DepAnyToAnyInfoData.anyToanyTotal,
					}, 2)
					const chart2 = await this.$refs.chartRef2.init(echarts);
					chart2.setOption(this.option2)
					this.pageShow=1
				} else {
					uni.showToast({
						title: data.Message,
						icon: 'none',
						duration: 5000,
						mask: true,
					});
				}
			},
			async getUserComplianceTotal() {//个人统计合格率统计
			    this.loading=true
				let data = await this.$api.getUserComplianceTotal(); //已经封装好的api
				if (data.Code == 200) {
					// this.loading = false
					this.UserComplianceTotalData=data.Data
					this.pageShow=1
				} else {
					uni.showToast({
						title: data.Message,
						icon: 'none',
						duration: 5000,
						mask: true,
					});
				}
			},
			async getUserSecurityInfo() {// 个人弱口令统计
				this.loading=true
				let data = await this.$api.getUserSecurityInfo(); //已经封装好的api
				if (data.Code == 200) {
					// this.loading = false					
					this.UserSecurityInfoData=data.Data
					// chart 图表实例不能存在data里
					this.getOption({
						data1: this.UserSecurityInfoData.weakPasswordcount,
						data2: this.UserSecurityInfoData.accountTotal,
						total: this.UserSecurityInfoData.accountTotal,
					}, 3)
					const chart3 = await this.$refs.chartRef3.init(echarts);
					chart3.setOption(this.option3)
					this.pageShow=1
				} else {
					uni.showToast({
						title: data.Message,
						icon: 'none',
						duration: 5000,
						mask: true,
					});
				}
			},
			async getUserAnyToAnyInfo() {// 个人违规策略统计
				this.loading=true
				let data = await this.$api.getUserAnyToAnyInfo(); //已经封装好的api
				if (data.Code == 200) {
					// this.loading = false					
					this.UserAnyToAnyInfoData=data.Data
					// chart 图表实例不能存在data里
					this.getOption({
						data1: this.UserAnyToAnyInfoData.resourcesCount,
						data2: this.UserAnyToAnyInfoData.policiesCount,
						total: this.UserAnyToAnyInfoData.anyToanyTotal,
					}, 4)
					const chart4 = await this.$refs.chartRef4.init(echarts);
					chart4.setOption(this.option4)
					this.pageShow=1
				} else {
					uni.showToast({
						title: data.Message,
						icon: 'none',
						duration: 5000,
						mask: true,
					});
				}
			},
			async init() {
				// chart 图表实例不能存在data里
				// this.getOption({
				// 	data1: 0,
				// 	data2: 0,
				// 	data3: 0,
				// 	total: 0,
				// }, 1)
				// const chart1 = await this.$refs.chartRef1.init(echarts);
				// chart1.setOption(this.option1)
				// this.getOption({
				// 	data1: 0,
				// 	data2: 0,
				// 	data3: 0,
				// 	total: 0,
				// }, 2)
				// const chart2 = await this.$refs.chartRef2.init(echarts);
				// chart2.setOption(this.option2)
				// this.getOption({
				// 	data1: 0,
				// 	data2: 0,
				// 	data3: 0,
				// 	total: 0,
				// }, 1)
				// const chart3 = await this.$refs.chartRef3.init(echarts);
				// chart3.setOption(this.option1)
				// this.getOption({
				// 	data1: 0,
				// 	data2: 0,
				// 	data3: 0,
				// 	total: 0,
				// }, 2)
				// const chart4 = await this.$refs.chartRef4.init(echarts);
				// chart4.setOption(this.option2)
			},
			getOption(data, type) {
				let seriesData = data.total ? [{
						value: data.data1,
						name: '高风险'
					},
					{
						value: data.data2,
						name: '中风险'
					},
				] : null
				this['option' + type] = {
					color: ['#FF3A03', '#F37A00'],
					series: [{
							type: 'pie',
							connectNulls: false,
							radius: ['60%', '75%'],
							label: {
								show: false
							},
							data: seriesData
						},
						{
							type: 'pie',
							radius: ['60%', '75%'],
							label: {
								normal: {
									show: true,
									position: 'center',
									formatter: (params) => {
										return [
											`{a|${this.$utils.commafy(data.total)}}`,
											`{b|${type === 1||type === 3 ? '账号总数' : '双Any策略数'}}`
										].join('\n');
									},
									rich: {
										a: {
											fontSize: 24,
											color: '#5F6475',
											fontWeight: 'bold',
											padding: [0, 0, 5, 0]
										},
										b: {
											fontSize: 12,
											color: '#555'
										}
									}
								}
							},
							data: [{
								value: 1,
								itemStyle: {
									color: 'transparent'
								}
							}]
						}
					]

				}
			}
		}
	}
</script>

<style lang="scss" scoped>
.main-card-row1 {
	border-radius: 16rpx 16rpx 0 0;
	background: linear-gradient(270deg, #1078DE 0%, #43A2EB 100%);
	// display: flex;
	// justify-content: space-around;
	padding: 37rpx 0 31rpx 0;
	&>view {
		flex: 1;
		overflow: hidden; /* 确保超出容器的文本被裁剪 */
		white-space: nowrap; /* 确保文本在一行内显示 */
		display: flex;
		// flex-direction: column;
		align-items: center;
		&>span:first-child {
			width: 100%;
			overflow: hidden; /* 确保超出容器的文本被裁剪 */
			white-space: nowrap; /* 确保文本在一行内显示 */
			text-overflow: ellipsis; /* 超出部分显示为省略号 */
			text-align: center;
			font-weight: 700;
			margin-bottom: 5rpx;
			font-size: 16px;
		}
		&>span:last-child {
			font-size: 20rpx;
		}
	}
}
.main-card-row2 {
	border-radius: 0 0 16rpx 16rpx;
	box-shadow: 0rpx 30rpx 20rpx 1rpx rgba(51,149,231,0.26);
	background: linear-gradient(270deg, #1078DE 0%, #5FBAF2 100%);
	display: flex;
	
	.row2-left, .row2-right {
		padding: 40rpx 0;
		flex: 1;
		&>view {
			display: flex;
			&:not(:last-child) {
				margin-bottom: 20rpx;
			}
			&>span {
				&:first-child {
					font-size: 24rpx;
					color: rgba(255, 255, 255, .8);
					font-size: 14px;
				}
				&:last-child {
					font-weight: 700;
				}
			}
		}
	}
	.row2-left>view>span:first-child {
		width: 150rpx;
	}
	.row2-right>view>span:first-child {
		width: 180rpx;
	}
}

.dept-name {
	font-size: 34rpx;
	display: flex;
	padding: 10rpx 0 10rpx 0rpx;
}
.admin-card-content {
	// padding: 0 20rpx 20rpx 20rpx;
	&>view {
		display: flex;
		justify-content: space-around;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		margin-bottom: 11rpx;
		
		&>view {
			display: flex;
			flex-direction: column;
			align-items: center;
			color: #5F6475;
			&>span:first-child {
				font-weight: 700;
				margin-bottom: 5rpx;
				font-size: 16px;
			}
			&>span:last-child {
				font-size: 24rpx;
			}
		}
	}
	.row1 {
		background: #F4F6F8;
		padding: 20rpx 0;
		justify-content: center;
		display: initial !important;
	}
	.row2 {
		.row2-left, .row2-right {
			flex: 1;
			background: #F4F6F8;
			padding: 26rpx 0 17rpx 24rpx;
			border-radius: 8rpx 8rpx 8rpx 8rpx;
			&>view {
				display: flex;
				width: 100%;
				&:not(:last-child) {
					margin-bottom: 10rpx;
				}
				&>span {
					&:first-child {
						font-size: 24rpx;
						color: rgba(95, 100, 117, .8);
					}
					&:last-child {
						font-weight: 700;
					}
				}
			}
		}
		.row2-left {
			margin-right: 10rpx;
		}
		.row2-left>view>span:first-child {
			width: 150rpx;
		}
		.row2-right>view>span:first-child {
			width: 180rpx;
		}
	}
}
.card-box {
    margin: 12px;
    background: white;
    padding: 10px;
    border-radius: 5px;
    box-shadow: 0px 0px 3px 1px rgba(36, 111, 161, 0.06);
}
.main-card{
	margin: 10px 0;
}
.card-title{
	color: #303133;
}
.card-top{
	margin: 0;
}
.card-group {
    display: flex;
}
.card-group .card {
    flex: 1;
}
.card{
	margin: 10px 0  !important;
}
.chart-tips{
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    width: 100%;
    height: 71px;
    // margin-bottom: 35px;
}
.chart-tips > span {
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
}
.row2-left > uni-view > span:first-child {
    line-height: 24px;
}
.row2-right > uni-view > span:first-child {
    line-height: 24px;
}
.main-data{
    width: 33%;
    text-align: center;
    flex: 1;
    padding: 0px 0 8px 0;
    display: flex;
    flex-direction: column;
    align-items: center;
	    font-size: 14px;
}
.main-list{
justify-content: center;
flex-direction: initial !important;
display: flex!important;
}
.admin-card-content >.row1> .main-list > .main-data > span:first-child {
    font-weight: 700;
    margin-bottom: 2px;
}
.main-card-row1> .main-list > .main-data > span:first-child {
    font-weight: 700;
    margin-bottom: 2px;
}
</style>